<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    1、不同浏览器的标签默认的外补丁(margin)和内补丁(padding)不同
    解决方案：
       css里增加通配符
       *{
        margin: 0;
        padding: 0;
       }
    
    2、IE6双边距问题;在IE6中设置了float,同时又设置了margin，就会出现双边距问题
    解决方案：
       设置display: inline;
    
    3、当标签的高度设置小于10px,在IE6、IE7中会超出自己设置的高度
    解决方案：
       超出高度的标签设置overflow：hidden,或者设置line-height的值小于你的设置高度

    4、图片默认有间距
    解决方案：
       使用float为img布局

    5、光标手型：cursor：hand在safari上不支持IE才支持
    解决方案：
       统一使用cursor；pointer
    
    6、解决在IE6下，列表与日期错位的问题
    解决方案：
       日期<span>标签放在标题<a>标签之前即可
    
    7、IE6-7line-height失效问题，在ie中img与文字放在一起时，line-height不起作用
    解决方案：
       都设置成float
    
    8、两个块级元素，父元素设置了overflow：auto；子元素设置了position：relative；且高度大于父元素，在IE6、IE7会被隐藏而不是溢出
    解决方案：
       父级元素设置position:relative

    9、上下（边距）margin的重叠问题，给上边元素设置了margin-bottom，给下边元素设置了margin-top，浏览器只会识别较大值；
    解决方案：
       margin-top和margin-bottom中选择一个，只设置其中一个值；
       
    10：表单元素行高不一致
    解决方案：
       给表单元素添加
       float：left（左浮动）；或者是
       vertical-align：middle；（垂直对齐方式：居中）

</body>
</html>